<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="content-type" content="text/html;charset=utf-8">
	<title>D 生活</title>
    <%@include file="/views/common/include/taglib.jsp"%>
    <%@include file="/views/common/include/head.jsp"%>
	<link rel="stylesheet" href="${ctx}/css/page/header2.css" type="text/css">
    <link rel="stylesheet" href="${ctx}/css/page/reset.css" type="text/css">
    <link rel="stylesheet" href="${ctx}/css/page/person.css" type="text/css">
<%--     <link rel="stylesheet" href="${ctx}/css/page/person-left.css" type="text/css"> --%>
    <link rel="stylesheet" href="${ctx}/css/page/person-my.css" type="text/css">
	<link rel="stylesheet" href="${ctx}/css/page/footer.css" type="text/css">
	<link rel="stylesheet" href="${ctx}/css/page/comment.css" type="text/css">
<style type="text/css">

/* 星级评分 */
.shop-rating {
    height: 25px;
    overflow: hidden;
    zoom: 1;
    padding: 2px 0px;
    position: relative;
    z-index: 999;
}
.shop-rating span {
    height: 23px;
    display: block;
    line-height: 23px;
    float: left;
}
.shop-rating span.title {
    width: 150px;
    text-align: right;
    margin-right: 5px;
}
.shop-rating ul {
    float: left;
    margin:0;padding:0
}
.shop-rating .result {
    margin-left: 20px;
    padding-top: 2px;
}
.shop-rating .result span {
    color: #ff6d02;
}
.shop-rating .result em {
    color: #f60;
    font-family: arial;
    font-weight: bold;
}
.shop-rating .result strong {
    color: #666666;
    font-weight: normal;
}
.rating-level,
.rating-level a {
    background: url(http://www.nowamagic.net/librarys/images/veda/star_v2.png) no-repeat scroll 1000px 1000px;
}
.rating-level {
    background-position: 0px 0px;
    width: 120px;
    height: 23px;
    position: relative;
    z-index: 1000;
}
.rating-level li {
    display: inline;
}
.rating-level a {
    line-height: 23px;
    height: 23px;
    position: absolute;
    top: 0px;
    left: 0px;
    text-indent: -999em;
    *zoom: 1;
    outline: none;
}
.rating-level a.one-star {
    width: 20%;
    z-index: 6;
}
.rating-level a.two-stars {
width: 40%;
z-index: 5;
}
.rating-level a.three-stars {
    width: 60%;
    z-index: 4;
}
.rating-level a.four-stars {
    width: 80%;
    z-index: 3;
}
.rating-level a.five-stars {
    width: 100%;
    z-index: 2;
}
.rating-level .current-rating,.rating-level a:hover{background-position:0 -28px;}
.rating-level a.one-star:hover,.rating-level a.two-stars:hover,.rating-level a.one-star.current-rating,.rating-level a.two-stars.current-rating{background-position:0 -116px;}
.rating-level .three-stars .current-rating,.rating-level .four-stars .current-rating,.rating-level .five-stars .current-rating{background-position:0 -28px;}
</style>
<script src="${ctx}/js/controllers/mall/order/orderListController.js" type="text/javascript"></script>
</head>
	
<body>
	<jsp:include page="/views/common/head_main.jsp" />
	<div class="bg">
		<div class="contentbox1 contentbox">
			<jsp:include page="/views/main/main_personal_left.jsp" />
            <div class="rightlist right">
            <input type="hidden" id="item" value="${sessionScope.item_personal}"/>
		          <div class="my-order-detail">
		              <div class="padd1">
		                  <div class="title">发表评价</div>
		                  <input id="goodsId" type="hidden" value="${goodsInfo.id}"/>
		                  <input id="specificationId" type="hidden" value="${orderDetailInfo.specificationId}"/>
		                  <input id="orderInfoId" type="hidden" value="${orderId}"/>
		                  <div class="line"></div>
		              </div>
		              <br/>
		              <div class="all">
		              	  <div class="image" style="float:left;">
		              		  <c:if test="${ not empty goodsInfo.logo}">
			              		   <a href="${ctx}/GoodsDetail?id=${orderDetailInfo.goodsId}&type=${orderDetailInfo.goodsInfo.type}" target="_blank">
									  <img width="70px" height="80px" src="${sessionScope.image_logo}${goodsInfo.logo}" />
								  </a>
							  </c:if>
							  <c:if test="${ empty goodsInfo.logo}">
								   <a href="${ctx}/GoodsDetail?id=${orderDetailInfo.goodsId}&type=${orderDetailInfo.goodsInfo.type}" target="_blank">
									  <img width="70px" height="80px" src="${ctx}/images/seller/common/defaultgoods.jpg" />
								  </a>
							  </c:if>
						  </div>
						  <div class="goodsMsg"style="float:left;">	
							  <p>${goodsInfo.name}</p>
							  <c:forEach items="${orderDetailInfo.specNameValueList}" var="specNameValue" varStatus="specNameValueStatus">
								  <p style="display:inline"><span >${specNameValue.attrName}:</span>&nbsp;<span>${specNameValue.attrValue}</span></p>&nbsp;
							  </c:forEach>
							  <p style="display:inline">数量：${orderDetailInfo.amount}</p><br/>
							  <p ><span style="float:left;">实际付款：￥${orderDetailInfo.price}</span></p>
						  </div>
						  <br/>
						  <br/>
						  <br/>
						  <br/>
						  <br/>
						  <br/>
						  <div><div class="score">评分：</div> <input id="level" type="hidden" value=""/>
							  <div class="shop-rating" style="display:inline">
							    <ul class="rating-level" id="stars1">
							        <li><a class="one-star" star:value="1" href="#">1</a></li>
							        <li><a class="two-stars" star:value="2" href="#">2</a></li>
							        <li><a class="three-stars" star:value="3" href="#">3</a></li>
							        <li><a class="four-stars" star:value="4" href="#">4</a></li>
							        <li><a class="five-stars" star:value="5" href="#">5</a></li>
							    </ul>
							    <span class="result" id="stars1-tips"></span>
							    <input type="hidden" id="stars1-input" name="a" value="" size="2" />
							 </div>
						  </div>
						  <br/>
						  <br/>
						  <br/>
						  <div>
						  	  <div class="commentContent"  ><p>评价内容：</p><p>&nbsp;&nbsp;&nbsp;(0/200)</p></div>
						  	   <div><textarea onpropertychange="if(value.length>200) value=value.substr(0,200)" maxlength="200" style="height: 100px;width: 400px;text-indent: 5px;" id="commentContent" onblur="checkCommentContent();"></textarea></div>
						  </div>
						  <br/>
						  <br/>
						  <br/>
						 <div>
						 	<div class="save" >
								<button class="buttonEdit" onclick="saveComment();">提交</button>
							</div>
							<div class="cancle" >
								<button class="buttonCancle" onclick="backOrderDetail(${orderId});">取消</button>
							</div>
						 </div>	  
						  
						  
						 
		              </div>
		           </div>
             </div>
         </div>	
     </div>	
     
	<jsp:include page="/views/common/footer.jsp" />
	<script src="${ctx}/js/lib/layer/layer.js"></script>
	<script src="${ctx}/js/lib/jquery.JPlaceholder.js"></script>
	<script type="text/javascript">
		var ctx = '${ctx}';
		setCtx(ctx);
	</script>
</body>
</html>

